// @auth: yan rui
// @Time: 2024-10-31 10:02:08
// @desc: 聊天窗口页面，首页聊天列表点击进入

import 'package:flutter/material.dart';
import '/components/page/common.dart';
import '../widgets/chat_msg_item.dart';
import '/components/actions/more.dart';
import '/config/base_url.dart';

class ChatWindowPage extends StatelessWidget {
  const ChatWindowPage({super.key});

  @override
  Widget build(BuildContext context) {

    Map args = ModalRoute.of(context)!.settings.arguments as Map;
    debugPrint('1号路由参数：$args');

    return CommonPage(
      title: args['userName'] ?? '微信',
      isShowLine: true,
      actions: [
        MoreAction(
          onPressed: () {
            Navigator.pushNamed(context, 'ChatInfoPage', arguments: {
              'userName': '测试传参111',
            });
          },
        )
      ],
      child: const ChatWindowWidget(),
    );
  }
}

// 聊天列表组件
class ChatWindowWidget extends StatefulWidget {
  const ChatWindowWidget({super.key});

  @override
  State<ChatWindowWidget> createState() => _ChatWindowWidgetState();
}

class _ChatWindowWidgetState extends State<ChatWindowWidget> {

  // 聊天记录
  List messageList = [
    {
      'content': '你好，我是前端没钱😘',
      'userId': '1',
    },
    {
      'content': '嗯，你好。听说过你',
      'userId': '0',
    },
    {
      'content': '涉江采芙蓉，兰泽多芳草。采之欲遗谁，所思在远道。还顾望旧乡，长路漫浩浩。同心而离居，忧伤以终老。',
      'userId': '0',
    },
    {
      'content': '嗯，这首诗我听说过的，挺不错的。此诗用借景抒情及白描手法，抒写了妇思游子相思离别之情。',
      'userId': '1',
    },
    {
      'content': '看来你很懂嘛',
      'userId': '0',
    },
    {
      'content': '$baseUrl/avatar/tx69.jpg',
      'userId': '1',
      'contentType': 'image'
    },
    {
      'content': '$baseUrl/avatar/tx64.jpg',
      'userId': '0',
      'contentType': 'image'
    },
    {
      'content': '这是你本人吗，真漂亮。',
      'userId': '1',
    },
    {
      'content': '那当然啦',
      'userId': '0',
    },
    {
      'content': '哥哥',
      'userId': '1',
    },
    {
      'content': '啊哈',
      'userId': '0',
    },

    {
      'content': '红豆生南国，春来发几枝',
      'userId': '1',
    },
    {
      'content': '$baseUrl/avatar/tx61.jpg',
      'userId': '0',
      'contentType': 'image'
    },
    {
      'content': '愿君多采撷，此物最相思',
      'userId': '1',
    },
    {
      'content': '文化人呀',
      'userId': '0',
    },
    {
      'content': '见到你的第一眼，我就知道，我这辈子都是想你。我此生就这样了。控制不住的想你',
      'userId': '1',
    },
    {
      'content': '😀感动~',
      'userId': '0',
    },
  ];

  final TextEditingController _textController = TextEditingController();

  void _sendMessage() {
    if (_textController.text.isNotEmpty) {
      setState(() {
        messageList.add({
          'userId': '1',
          'content': _textController.text,
          'contentType': 'text',
        });
        _textController.clear();
      });
    }
  }

  @override
  Widget build(BuildContext context) {

    // 聊天列表
    Widget chatListWidget = Padding(
      padding: const EdgeInsets.fromLTRB(10, 0, 10, 0),
      // child: ListView(
      //   children: [
      //     Column(
      //         crossAxisAlignment: CrossAxisAlignment.start,
      //         children: messageList.map((item) =>
      //             ChatMsgItem(
      //               userId: item['userId'],
      //               content: item['content'],
      //               avatarUrl: item['userId'] == '1' ? '$baseUrl/avatar/tx1.jpg' : '$baseUrl/avatar/tx2.jpg',
      //               contentType: item['contentType'] ?? 'text', // 聊天类型，默认为文本
      //             )
      //         ).toList()
      //     )
      //   ],
      // ),
      // 这种写法更高效
      child: ListView.builder(
        itemCount: messageList.length,
        itemBuilder: (context, index) {
          final item = messageList[index];
          return ChatMsgItem(
            userId: item['userId'],
            content: item['content'],
            avatarUrl: item['userId'] == '1' ? '$baseUrl/avatar/tx1.jpg' : '$baseUrl/avatar/tx2.jpg',
            contentType: item['contentType'] ?? 'text', // 聊天类型，默认为文本
          );
        },
      ),
    );

    const double btnWidth = 26;
    // 输入框组件
    Widget inputBoxWidget = Row(
      children: [
        Expanded(
          child: TextField(
            controller: _textController,
            maxLines: 5,
            minLines: 1,
            textAlignVertical: TextAlignVertical.center,
            decoration: const InputDecoration(
              // hintText: '输入消息...',
              border: InputBorder.none,
              filled: true,
              fillColor: Colors.white,
              contentPadding: EdgeInsets.symmetric(vertical: 6.0, horizontal: 16.0)
            ),
            style: const TextStyle(fontSize: 14),
          ),
        ),
        SizedBox(
          width: btnWidth,
          height: btnWidth,
          child: IconButton(
            padding: const EdgeInsets.all(2.0),
            iconSize: 24,
            icon: const Icon(Icons.send, size: 20,),
            onPressed: _sendMessage,
          ),
        ),
      ],
    );

    return Column(
      children: [
        Expanded(
          child: chatListWidget,
        ),

        Container(
          padding: const EdgeInsets.all(8.0),
          decoration: BoxDecoration(
            color: Colors.grey.shade200,
            border: Border(top: BorderSide(color: Colors.grey.shade300)),
          ),
          child: inputBoxWidget,
        ),
      ],
    );
  }
}
